@color-main: #01A2FF;
@color-b: #00ffff;
@color-r: #ff0000;
@color-border-gameWrapper: #2455d6;
@color-border-bottompanel: #00a1ff;

.app {
  font-style: normal;
}

.m-auto {
  margin: 0 auto;
}

.wrapper {
  color: inherit;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  // border-bottom: 31px solid transparent;
  background-color: @color-main;
  overflow-x: hidden;

  .upperWrapper {
    background-size: 100% 100%;
    background-repeat: no-repeat;

    .img {
      width: 100%;
    }
  }

  .titleWrapper {
    width: 100%;
    height: 100px;
    display: flex;
    justify-content: center;

    .title {
      margin: 0 auto;
      width: 248px;
      height: 149px;
      position: relative;
      top: -51px;
    }
  }

  .gameWrapper {
    margin: 0 auto;
    margin-top: 189px;
    width: 325px;
    height: 180px;
    border-radius: 23px;
    overflow: hidden;
    border: 4px solid @color-border-gameWrapper;
    z-index: 1;
  }

  .seriesWrapper {
    margin: 0 auto;
    margin-top: 249px;
    width: 326px;
    height: 1336px;
  }

  .mid {
    margin-top: 16px;
    width: 375px;
  }

  .bottom {
    margin: 0 auto;
    width: 351px;
    height: 135px;
    margin-top: 13px;
  }

  // .bottomPanel {
  //   width: 100%;
  //   height: 50px;
  //   background-color: @color-border-bottompanel;
  //   position: fixed;
  //   bottom: 0;
  //   left: 0;
  // }
}